<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
        <title>宫颈黏液</title>
        <link href="css/scroll.css" rel="stylesheet" type="text/css">
        <style>
              @font-face {
                  font-family: 'regular';
                  src:url(font/SFRegular.ttf);
              }
        </style>

        <script src="js/common/echarts.js"></script>
        <script type="text/javascript" src="js/common/dateUtil.js"></script>
        <script type="text/javascript" src="js/common/mapUtil.js"></script>
        <script type="text/javascript" src="js/common/string2Map.js"></script>

        <script type="text/javascript" src="js/common/periodUtil.js"></script>
        <script type="text/javascript" src="js/mucus/initMucusChartData.js"></script>
        <script type="text/javascript" src="js/mucus/drawMucusChart.js"></script>
        <script type="text/javascript" src="js/mucus/mucusDetail.js"></script>
        <script type="text/javascript" src="js/common/detailUtil.js"></script>
        <script type="text/javascript" src="js/mucusChart.js"></script>
    </head>

    <body style="margin:0px;padding:0px; overflow-x: hidden; overflow-y: hidden" onload="firstShowMucusChart()">

        <div id="div_fix_zone" style="overflow: hidden;">
            <div id="div_scroll_zone" style="overflow: scroll;overflow-y:hidden">

                <div id="mucusChartYAxis" style="display:none; text-align:right;position:absolute; z-index:999; margin-left:1px; font-size:10px; font-weight:1; color:#000; font-family:'regular'">
                    <table id="mucusChartYAxisTable">
                    </table>
                </div>

                <div id="mucusChart">
                </div>

            </div>
        </div>

        <table id="detail_table" style="display:none; text-align:center; margin-left:auto; margin-right:auto;font-family:'regular'">
        <tr style="width:100%">
            <td id="periodDayNum_td">
                <div id="periodDayNum_div" style="color:#666461">

                </div>
            </td>
            <td id="detail_td" style="background-color:#d17be0">
                <div id="detail_div">
                    <div id="detail_div2">
                        <img id="heart" alt="heart" src="img/detailCircle/heart.png"/>
                        <img id="moon" alt="moon" src="img/detailCircle/moon.png"/>
                        <img id="drink" alt="drink" src="img/detailCircle/drink.png"/>
                        <img id="medicine" alt="medicine" src="img/detailCircle/medicine.png"/>
                        <img id="plane" alt="plane" src="img/detailCircle/plane.png"/>
                    </div>
                    <div id="detailMucus" style="margin:2.5%;font-size:200%;color:#FFF">  </div>
                    <div id="detailDate" style="font-size:110%;color:#72407b"> </div>
                    <div id="detailDayOfWeek" style="color:#72407b">  </div>
                </div>
            </td>
            <td id="periodDayTitle_td">
                <div id="periodDayTitle_div">
                    <img alt="periodDayTitle" id="periodDayTitle" style=" width:90%"/>
                </div>
            </td>
        </tr>
      </table>
    </body>

</html>